<template>
  <div class="video_look">
    <h2 class="video-title">{{ title }}</h2>
    <video width="100%" height="500px" controls>
      <source :src="videoUrl" type="video/mp4">
      <!-- <source src="movie.ogg" type="video/ogg"> -->
      <!-- 您的浏览器不支持 HTML5 video 标签。 -->
    </video>
  </div>
</template>

<script setup>
// import { ref, defineProps } from 'vue'
const props = defineProps({
  videoUrl: {
    type: String,
    default: 'https://www.example.com/sample-video.mp4'
  },
  title: {
    type: String,
    default: '视频播放'
  }
})
</script>

<style lang="scss" scoped>
.video-title {
  margin-bottom: 15px;
  font-size: 18px;
  font-weight: bold;
}
</style>
